<template>
  <div class="CertificateTable relative">
    <el-table border height="300" :data="listData" :row-class-name="rowClassName">
      <el-table-column type="index" label="序号" width="60"></el-table-column>
      <el-table-column prop="country_id" label="主讲人">
        <template #default="{ row }">
          <select-personnel
            v-model="row.lecturer_user_id"
            placeholder="请选择"
            :disabled="disabled"
          ></select-personnel>
        </template>
      </el-table-column>
      <el-table-column prop="patent_type" label="参与人员">
        <template #default="{ row }">
          <select-personnel
            v-model="row.join_user_ids"
            placeholder="请选择"
            :multiple="true"
            :disabled="disabled"
          ></select-personnel>
        </template>
      </el-table-column>
      <el-table-column prop="certificate_type" label="发布会时间">
        <template #default="{ row }">
          <el-date-picker
            v-model="row.apply_time"
            type="date"
            placeholder="请选择"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            style="width: 100%"
            :disabled="disabled"
          />
        </template>
      </el-table-column>
      <el-table-column prop="remark" label="备注">
        <template #default="{ row }">
          <el-input
            v-model="row.remark"
            maxlength="1000"
            placeholder="备注"
            :disabled="disabled"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="filename" label="文件名称">
        <template #default="{ row }">
          <el-input
            v-model="row.filename"
            placeholder="请输入文件名称"
            :disabled="disabled"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="operation" label="操作">
        <template #default="{ row, $index }">
          <el-button type="primary" @click="copyRow(row)" link v-if="!disabled"
            >复制</el-button
          >
          <el-button type="primary" @click="download(row)" link>下载</el-button>
          <el-button type="danger" @click="deleteRow(row, $index)" link v-if="!disabled"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup name="presentationTable">
import { copy } from "@/utils/index";
import { downloadFile } from "@/utils/downloadFile.js";
let handleType = reactive(inject("handleType"));
const emit = defineEmits(["update:modelValue", "change"]);
const props = defineProps({
  list: {
    type: Array,
    default: () => {
      return [];
    },
  },
  type: {
    type: Number,
  },
  disabled: {
    type: Boolean,
    default: false,
  },
});

const listData = computed({
  get: () => props.list || [],
  set: (val) => {
    emit("update:modelValue", val);
  },
});
const copyRow = (item) => {
  copy(item.filepath);
};
const download = ({ filename, filepath }) => {
  downloadFile(filepath, filename);
};

const rowClassName = ({ row }) => {
  if (row.delete === 1) {
    return "hidden-row";
  }
  return "";
};

const deleteRow = (row, index) => {
  if (handleType.value == "edit") {
    listData.value[index].delete = 1;
  } else {
    listData.value.splice(index, 1);
  }
};
</script>

<style lang="scss" scoped>
.hidden-row {
  display: none;
}
</style>
